import React from 'react';
import styles from './style/index.module.less';
import LessonIcon from './icons/lesson.svg';
import { IconRight } from '@arco-design/web-react/icon';

function Lesson({ item }) {
  return (
    <div className={styles['course-container']}>
      <div className={styles['icon']}>
        <LessonIcon width={40} height={40} />
      </div>
      <div className={styles['lesson']}>
        <h2>{item.name}</h2>
        <div className={styles['lesson-intro']}>{item.introduce}</div>
      </div>
      <div className={styles['section']}>
        <h2>{item.classHour}</h2>
        <div className={styles['title']}>章节</div>
      </div>
      <div className={styles['knowledge']}>
        <h2>321</h2>
        <div className={styles['title']}>知识</div>
      </div>
      <div className={styles['relevant-persons']}>
        <h2>432,1231</h2>
        <div className={styles['title']}>相关资料</div>
      </div>
      <div className={styles['student-num']}>
        <h2 className={styles['num']}>451</h2>
        <div className={styles['title']}>课中学生人数</div>
      </div>
      <div className={styles['right']}>
        <IconRight />
      </div>
    </div>
  );
}

export default Lesson;
